<template>
	<div>
		<el-tabs v-model="activeName" @tab-click="handleTabChange">
			<el-tab-pane v-for="(item, index) in tabsList" :key="index" :label="item.label" :name="item.value"> </el-tab-pane>

			<div class="content-card">
				<html-label :title="activeLabelTitle">
					<div v-if="showBtn && ['BaseDetail', 'Extend'].includes(activeName)">
						<el-button type="primary" plain v-auth="[baseConfig.auth.edit]" @click="handleOperate('edit')">{{ nowRowData.workType == 2?'信息编辑':'信息变更' }}  </el-button>
					</div>
				</html-label>

				<component
					v-if="!loading"
					class="pd10"
					:is="whickComm[activeName]"
					@refresh="handleRefresh"
					:nowRowData="nowRowData"
					:actionBtn="false"
					:searchConfig="false"
          :soleKey="`dpFoundationPractitioners-${nowRowData.idCard}`"
				>
				</component>
			</div>
		</el-tabs>
	</div>
</template>

<script setup lang="ts">
import BaseDetail from './BaseDetail/index.vue'
import Train from './Train/index.vue'
import serviceOrder from './serviceOrder/index.vue'
import Extend from './Extend/index.vue'
import Experience from './Experience/index.vue'
import punishment from './punishment/index.vue'
import Subsidy from './Subsidy/index.vue'
import OrgServiceInfo from './OrgServiceInfo/index.vue'
import DataChangeLog from '@/views/datacenter/components/DataChangeLog/index.vue'
import { baseConfig } from '../config'
import { useCommonStore } from '@/stores/common'
import { useOperate } from '@/views/datacenter/hooks/useConfig'
import bus from '@/utils/eventbus'
import ChainBlockInfo from "./ChainBlockInfo/index.vue"
import ClockRecord from './ClockRecord/index.vue'
import information from './information/index.vue'
import Practitioners from './Practitioners/index.vue'
import FurloughRecord from './FurloughRecord/index.vue'

const { onDelete, onMessageChange } = useOperate(5)
const { setTempParams } = useCommonStore()

const whickComm = {
	BaseDetail,
	Extend,
	Experience,
	Train,
	punishment,
	Subsidy,
	serviceOrder,
  DataChangeLog,
  OrgServiceInfo,
  ChainBlockInfo,
  ClockRecord,
  information,
  Practitioners,
  FurloughRecord
}
type Props = {
	nowRowData?: any
	showBtn?: boolean
}
const props = withDefaults(defineProps<Props>(), {
	showBtn: true,
})
provide('nowRowData', props.nowRowData)

const emit = defineEmits(['refresh', 'rechange'])
const loading = ref(false)
const activeLabelTitle = ref('基础信息')

const tabsList: any = [
	{ label: '基础信息', value: 'BaseDetail' },
	{ label: '扩展信息', value: 'Extend' },
	{ label: '资料信息', value: 'information' },
	{ label: '职业/执业证书', value: 'Practitioners' },
	{ label: '就职记录', value: 'Experience' },
	{ label: '休假记录', value: 'FurloughRecord' },
	{ label: '培训记录', value: 'Train' },
	{ label: '补贴记录', value: 'Subsidy' },
	{ label: '奖惩记录', value: 'punishment' },
	{ label: '社区居家服务工单', value: 'serviceOrder' },
	{ label: '机构服务和管理', value: 'OrgServiceInfo' },
	{ label: '信息编辑记录', value: 'DataChangeLog' },
	{ label: '员工打卡记录', value: 'ClockRecord' },
	{ label: '上链信息', value: 'ChainBlockInfo' },
]
const activeName = ref('BaseDetail')

const openEdit = () => {
	const rechangeOperate = () => {
		const activeStr = {
			BaseDetail: 1,
			Extend: 2,
		}
		setTempParams({
			name: props.nowRowData.practitionersName,
			idCard: props.nowRowData.idCard,
			active: activeStr[activeName.value] || 1,
		})
		emit('rechange', 'Rechange', props.nowRowData, '信息变更')
	}
	if (props.nowRowData.workType == 2) {
		rechangeOperate()
	} else {
		onMessageChange().then(() => {
			rechangeOperate()
		})
	}
}

const handleOperate = (type: string) => {
	if (type == 'delete') {
		onDelete(props.nowRowData[baseConfig.rowKey], baseConfig.api.delete, props.nowRowData.practitionersName)
			.then(() => {
				emit('refresh')
			})
			.catch(() => {
				return
			})
	} else {
		openEdit()
	}
}

bus.on('menu-operate', (res) => {
	if (res.pageName == baseConfig.pageName) {
		handleOperate(res.operate)
	}
})

const handleTabChange = (tab) => {
	activeLabelTitle.value = tab.props.label
}

const handleRefresh = () => {
	emit('refresh')
}
</script>

<style scoped></style>
